<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="utf-8">
		<link rel="stylesheet" type="text/css" href="css/jquery.fullPage.css" />
		<link rel="stylesheet" type="text/css" href="css/index.css" />
		<link rel="stylesheet" type="text/css" href="css/_reset.css" />
		<link rel="stylesheet" type="text/css" href="css/common.css" />
		<link rel="stylesheet" type="text/css" href="css/animated.css" />
		<link rel="stylesheet" type="text/css" href="css/swiper.min.css" />
		<style type="text/css">
			
			#box {
				/*position: /relative;*/
				color: white;
				transition: all 1000ms cubic-bezier(0.86, 0, 0.07, 1);
				-webkit-transition: all 1000ms cubic-bezier(0.86, 0, 0.07, 1);
			}
			
			#box.bottom {
				transform: translate3d(0px, -600px, 0px);
				-webkit-transform: translate3d(0px, -600px, 0px);
			}
		</style>
	</head>

	<body>
		<div id="box">
			<!--头部导航栏-->
			<div class="header">
				<ul>
					<li>
						<a href="Brand.html">
							鲜箤品牌
						</a>
					</li>
					<li>
						<a href="Selling.html">
							鲜茶热卖
						</a>
					</li>
					<li>
						<a href="Point.html">
							优势卖点
						</a>
					</li>
					<li class="imgs"><img src="img/header.jpg" /></li>
					<li>
						<a href="Investment.html">
							投资盈利
						</a>
					</li>
					<li>
						<a href="Company.html">
							名企扶持
						</a>
					</li>
					<li>
						<a href="Contact-us.html">
							联系我们
						</a>
					</li>
				</ul>
			</div>
			<div id="fullpage">
				<div class="section section01 page">
					<div class="page1">
						<img src="img/1.png" class="con Top_" />
						<img src="img/2.png" class="con Top_ yanchi03" />
						<img src="img/3.png" class="con Top_ yanchi09" />
						<img src="img/4.png" class="con Top_ yanchi09" />
						<img src="img/5.png" class="con Top_ yanchi11" />
						<img src="img/6.png" class="zoomInRight con" />
						<img src="img/7.png" class="scale yanchi11" />
						<img src="img/8.png" class="scale yanchi13" />
						<img src="img/9.png" />
					</div>
				</div>
				<div class="section section02">
					<div class="swiper-container swipers">
						<div class="swiper-wrapper">
							<div class="swiper-slide">
								<img class="scale chans" src="img/p2-page.png" />
								<img class="wenan fadeInRight yanchi03" src="img/p2_wenan.png" />
							</div>
							<div class="swiper-slide">
								<img class="chan2 Left_ yanchi03" src="img/wenan3.png" />
								<img class="wenan2 scale" src="img/wenan4.png" />
							</div>
							<div class="swiper-slide">
								<img class="xian1 Right_ yanchi06" src="img/wenan06.png" />
								<img class="xian2 scale yanchi03" src="img/wenan5.png" />
							</div>
						</div>
						<div class="swiper-pagination"></div>
					</div>
				</div>
				<div class="section section03">
					<div class="page3">
						<img src="img/p3.png" class="scale" />
						<img src="img/p3_page.png" class="Right_ yanchi04" />
					</div>
				</div>
				<div class="section section04">
					<div class="page4">
						<img src="img/p4_page.png" class="Left_ yanchi06" />
						<img src="img/p4_mendian.png" class="scale yanchi09" />
					</div>
				</div>
				<div class="section section05">
					<div class="page5">
						<div class="footerImg">
							<img src="img/p5-page.png" class="scale" />
							<img src="img/p5-pages.png" class="scale yanchi03" />
							<img src="img/p5_page.png" class="scale yanchi06" />
							<img src="img/p5_wenan.png" class="Right_ yanchi10" />
						</div>
					</div>
				</div>
				<div class="footer">
					<div class="content">
							<div class="left_content">
								<img src="img/erma_03.jpg" />
							</div>
							<div class="right_content">
								<div class="header_">
									<ul>
										<li>首页</li>
										<li>鲜箤品牌</li>
										<li>鲜茶热卖</li>
										<li>优势卖点</li>
										<li>投资盈利</li>
										<li>名企扶持</li>
										<li>联系我们</li>
									</ul>
								</div>
								<div class="form">
									<form action="" method="post">
										<p>服务热线&nbsp;:&nbsp;<span>4006-330-627</span></p>
										<input type="text" class="user_name" name="" id="" value="" placeholder="姓名" />
										<input type="text" class="mobile_Val" name="" id="" value="" placeholder="电话" />
										<textarea name="" class="leave_msg" placeholder="留言" rows="" cols=""></textarea>
										<input type="button" name="" id="reset" value="重置" />
										<input type="button" name="" id="submit" value="提交" />
									</form>
								</div>
								<div class="xinxi">
									<p>壹家人餐饮管理服务有限公司</p>
									<p>华南运行中心</p>
									<p>地址 ：广东省广州市天河区风信路1号智盈商务中心3楼</p>
									<p>华北运营中心</p>
									<p>地址 ：北京市大兴区亦庄经济开发区科创十四街20号院嘉捷 BDA企业汇16号楼3单元</p>
									<p>华东运营中心</p>
									<p>地址 ：上海市闵行区莘庄新源路1356号汇力得产业园C座二层</p>
								</div>
							</div>
						</div>
						<div class="copyright">
							<p>壹家人餐饮管理服务有限公司 ICP备案号：粤ICP备88888888号-8 鲜动力Xpower官网网址：www.xiandongli888.com 网站地图 51La</p>
							<p>友情链接：黑龙茶加盟 冰淇淋加盟 </p>
						</div>
				</div>
			</div>
		</div>

		<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
		<script type="text/javascript" src="js/jquery.fullPage.min.js"></script>
		<!--<script src="js/jquery-2.1.0.js" type="text/javascript" charset="utf-8"></script>-->
		<script src="js/Leave_msg.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/swiper.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="layer/layer.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			var flag = true;
			var timer;

			function lock() {
				clearTimeout(timer);
				flag = false;
				timer = setTimeout(function() {
					flag = true;
				}, 250);
			}

			$('#fullpage').fullpage({
				'navigation': true,
				loopBottom: true, // 顶部轮滚
				css3: true, // 开启CSS3动画
				verticalCentered: false,
				//              afterLoad:function(link,index){
				//                  switch(index){
				//                      case 1:
				//
				//                      break;
				//                      case 2:
				//
				//                      case 3:
				//
				//                      case 4:
				//
				//                      break;
				//                  }
				//              },

				onLeave: function(index, nextIndex, direction) {
					var box = $("#box");

					// 底部
					if(index === 5 && nextIndex === 1) {
						box.addClass("bottom");
						$('.godown').hide();
						$('#fp-nav').hide();
						return false;
					} else {
						$('.godown').show();
						$('#fp-nav').show();
					}
					if(index === 5 && nextIndex === 4 && box.hasClass("bottom")) {
						lock();
						box.removeClass("bottom");
						return false;
					}

					// 返回事件阻塞
					return flag;
				}
			});
		</script>
		<script type="text/javascript">
			var mySwiper = new Swiper('.swiper-container', {
				pagination: '.swiper-pagination',
				prevButton: '.swiper-button-prev',
				nextButton: '.swiper-button-next',
				autoplay: 3000,
			});
			setTimeout(function() {
				$('.con').addClass('Fudong');
			}, 3000)
		</script>
	</body>

</html>